<script setup lang="ts">
import { tableConfig } from './config/table-config';
import { doGetPageUserInfo } from '@/api/setting/memberManagement';
import { doAddWorkshop } from '@/api/base/workshop/index';
import { UserVO } from '@/api/setting/memberManagement/model/type';
import { message } from '@/components/q-message/message';
import { checkRepeat, RepeatMsg } from '@/utils';

const { handleFullscreen, getMaxHeight, modalOk, modalSlotRef, loading, handleCancel, visible } =
    useModal();

const emit = defineEmits(['close']);

/**
 * @: 新增
 * @param {*} const
 * @return {*}
 */
const handleSubmit = async () => {
    const value = modalSlotRef.value?.getSaveData();
    const data = value.map((item: any) => {
        const { workshopCode, workshopName, workshopLeader, state } = item;
        return {
            userId: workshopLeader.id,
            state,
            workshopCode,
            workshopName
        };
    });
    const msg = checkRepeat(data, ['workshopCode']);

    if (msg) {
        const { value, line } = msg;
        RepeatMsg({ value, line, label: '车间编码' });
        return;
    }

    try {
        const res = await doAddWorkshop(data);
        if (res) {
            message.success('新增成功！');
            emit('close');
        }
        return res;
    } catch (error) {
        console.log(error);
    }
};

const open = () => {
    visible.value = true;
};
const selectLoading = ref(false);
/**
 * @: 用户名称
 * @param {*} ref
 * @param {*} key
 * @return {*}
 */
const customerOption = ref<UserVO[]>([]);
const customerRemoteMethod = async (query: string) => {
    selectLoading.value = true;
    try {
        const { data } = await doGetPageUserInfo({ userNameAndJobNumber: query, size: 100 }, 1);
        if (data?.records) {
            customerOption.value = data.records;
        }
    } catch (error) {
        console.log('-------', error);
    }
    selectLoading.value = false;
};
defineExpose({
    open
});
</script>

<template>
    <q-modal
        v-model:visible="visible"
        :fullscreen="true"
        width="960px"
        title="新增"
        :close-cancel="true"
        :confirm-selectLoading="loading"
        @ok="() => modalOk(handleSubmit)"
        @cancel="handleCancel"
        @fullscreen="handleFullscreen"
    >
        <base-table
            ref="modalSlotRef"
            :modal-mode="true"
            :max-height="getMaxHeight"
            :show-setting="false"
            :table-config="tableConfig"
            add-table-row
        >
            <template #workshopLeader="{ row }">
                <el-select
                    v-model="row.workshopLeader"
                    filterable
                    remote
                    :selectLoading="selectLoading"
                    reserve-keyword
                    :remote-method="customerRemoteMethod"
                    value-key="id"
                    popper-class="push-select"
                    placeholder="请选择"
                    @focus="customerRemoteMethod('')"
                >
                    <el-option
                        v-for="item in customerOption"
                        :key="item.id"
                        :label="item.username + ' - ' + item.jobNumber"
                        :value="item"
                    />
                    <template #footer>
                        <q-push-button @click="$router.push('/system')" />
                    </template>
                </el-select>
            </template>
            <template #contactNumber="{ row }">
                <el-input :model-value="row.workshopLeader?.phone" disabled placeholder="请输入" />
            </template>
        </base-table>
    </q-modal>
</template>

<style scoped lang="scss"></style>
